<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head th:replace="~{segmentation/_right_bottom_header::_header_common(~{::title},~{::link},~{::style})}">
    <meta charset="utf-8">
    <title>用户个人密码修改</title>
    <link>
    <style type="text/css"></style>
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>用户个人密码修改</legend>
        </fieldset>
        <form class="layui-form" id="userFormEdit" action="">
            <div class="layui-form-item" pane="">
                <label class="layui-form-label">帐号</label>
                <div class="layui-input-block">
                    <span class="view-span" sec:authentication="name"></span>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="required-red">*</span>旧密码</label>
                <div class="layui-input-block">
                    <input type="password" name="oldPassword" id="oldPassword" lay-verify="required|oldPassword"
                           lay-verType="tips"
                           placeholder="请输入旧密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="required-red">*</span>新密码</label>
                <div class="layui-input-block">
                    <input type="password" name="password" id="password" lay-verify="required|password"
                           lay-verType="tips"
                           placeholder="请输入新密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label"><span class="required-red">*</span>确认新密码</label>
                <div class="layui-input-block">
                    <input type="password" name="confirmPassword" id="confirmPassword" lay-verify="confirmPassword"
                           lay-verType="tips"
                           placeholder="请输入确认新密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item custom-text-align">
                <a class="layui-btn" lay-submit="" lay-filter="userFormEditPasswordSubmit">保存</a>
            </div>
        </form>
    </div>
</div>

<div th:replace="~{segmentation/_tail::_tail_common}"></div>
<script th:src="@{/js/plugins/jsencrypt/jsencrypt.js?v=1.0.0}" charset="utf-8" type="text/javascript"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script th:inline="javascript">
    layui.use(['form', 'common', 'encryption'], function () {
        var form = layui.form,
            layer = layui.layer,
            common = layui.common,
            encryption = layui.encryption;

        //自定义验证规则
        form.verify({
            account: function (value) {
                if (value.length < 6 || value.length > 25) {
                    return '帐号最少6个字符或最多25个字符';
                }
            },
            oldPassword: function () {
            },
            password: function (value) {
                if (!value) {
                    return;
                }
                if (value == $("#oldPassword").val()) {
                    return "新旧密码不能相同!";
                }
                if (value.length < 6 || value.length > 25) {
                    return '密码最少6个字符或最多25个字符';
                }
            },
            confirmPassword: function (value) {
                if (!value) {
                    return;
                }
                if ($("#password").val() != value) {
                    return '请输入相同密码';
                }
            }
        });

        //监听提交
        form.on('submit(userFormEditPasswordSubmit)', function (data) {
            // var index = layer.load(3);
            var oldPassword = encryption.encryptPublicKey(data.field.oldPassword);
            var password = encryption.encryptPublicKey(data.field.password);
            var confirmPassword = encryption.encryptPublicKey(data.field.confirmPassword);
            $.ajax({
                type: 'POST',
                url: '/personal/center/edit/password',
                data: {
                    "oldPassword": oldPassword,
                    "password": password,
                    "confirmPassword": confirmPassword
                },
                dataType: 'json',
                success: function (data) {
                    // layer.close(index);
                    if (data.code == Result.SUCCESS) {
                        layer.msg(data.msg, {
                            icon: 1,
                            shade: [0.3, '#f5f5f5'],
                            time: 1500
                        }, function () {
                            common.closeThisTabs("/personal/center/reset/password");
                        });
                    } else {
                        layer.msg(data.msg, {
                            icon: 2,
                            time: 3000
                        });
                    }
                },
                error: function (data) {
                    // layer.close(index);
                }
            });
            return false;//返回false防止重复提交
        });
    });
</script>

</body>
</html>